<template>
  <div>
    <FormDialogComponent
      ref="formtDialogRef"
      dialogWidth="1200px"
      v-model="form"
      :formInline="true"
      dialogTitle="移库"
      :formHeader="formHeader"
      :formUrl="urls.API_URL_BACKSTAGE_WMS_WMSMATERIALINVENTORYDETAILRELOCATION"
      :showFormFoot="false"
      form-action="none"
    >
      <!--表单提交的自定义内容 -->
      <template #form_warehouseSeatIdOfOrign>
        <WmsWarehouseCascadeSelectComponent
          ref="wmsWarehouseCascadeSelectFormComponentRef"
          v-model:warehouseSeatId="form.warehouseSeat.id"
          :disabled="true"
        />
      </template>
    </FormDialogComponent>
  </div>
</template>

<script setup lang="ts">
import FormDialogComponent from '@/components/base/table/form/FormDialogComponent.vue';
import type { FormHeader, TableData } from '@/types/interface/base_interface';
import type { WmsMaterialInventoryDetail } from '@/types/interface/wms_interface';
import { nextTick, onMounted, ref } from 'vue';
import urls from '@/api/request/urls';
import Request from '@/api/request/request';

// 接收父容器参数
interface Props {
  action?: string; // 表单的处理类型，post表示提交，put表示编辑
}
const props = withDefaults(defineProps<Props>(), {
  action: 'put'
});

//表单==========================================================
//表单对象
const form = ref<WmsMaterialInventoryDetail>({});
//表单元素类型
const formHeader = ref<FormHeader[]>([]);
onMounted(async () => {
  await nextTick();
  // 添加编辑表单
  formHeader.value = [
    {
      label: '物料信息',
      prop: 'seatDivider',
      type: 'divider'
    },
    {
      label: '物料名称',
      prop: 'materialName',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '生产批次',
      prop: 'batchNumber',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '生产厂家',
      prop: 'manuFacturer',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '生产日期',
      prop: 'productionDate',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '已入库数',
      prop: 'storedQuantity',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '当前总库存',
      prop: 'totalInventory',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '库存上限',
      prop: 'inventoryLimit',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '库存下限',
      prop: 'inventoryLower',
      placeholder: ' ',
      disabled: true
    },
    {
      label: '需要移出的物料库位信息',
      prop: 'seatDivider',
      type: 'divider'
    },
    {
      label: '源库位',
      prop: 'warehouseSeatIdOfOrign',
      type: 'custom'
    },
    {
      label: '物料数量',
      prop: 'inventory',
      rules: [
        {
          required: true,
          message: '不能为空',
          trigger: 'blur'
        }
      ]
    },
    {
      label: '备注',
      prop: 'remark',
      rules: [
        {
          max: 255,
          message: '长度在不能超过255个字符',
          trigger: 'blur'
        }
      ]
    }
  ];
});
//===================================对话框====================================================
const formtDialogRef = ref();
const openDialog = async (id: string) => {
  await formtDialogRef.value.openDialog();
  console.log(id);
  const resData: any = await new Request(`${urls.API_URL_BACKSTAGE_WMS_WMSMATERIALINVENTORYDETAIL}/${id}`).get();
  if (resData.success) {
    form.value = resData.data;
    //添加关联属性，方便表单操作(不至于添加多个自定义列)
    if (form.value.materialBatch) {
      form.value.manuFacturer = form.value.materialBatch.manuFacturer;
      form.value.batchNumber = form.value.materialBatch.batchNumber;
      form.value.productionDate = form.value.materialBatch.productionDate;
      form.value.storedQuantity = form.value.materialBatch.storedQuantity;
      if (form.value.materialBatch.material) {
        form.value.materialName = form.value.materialBatch.material.name;
      }
      if (form.value.materialInventory) {
        //物料库存的上下限
        form.value.inventoryLimit = form.value.materialInventory.inventoryLimit;
        form.value.inventoryLower = form.value.materialInventory.inventoryLower;
        form.value.totalInventory = form.value.materialInventory.totalInventory;
      }
    }
  }
};
const closeDialog = () => {
  formtDialogRef.value.closeDialog();
};
defineExpose({
  // 参考vue3官方文档，需要将函数暴露出去才能被父组件调用，setup模式是不暴露的
  openDialog,
  closeDialog
});
</script>

<style scoped></style>
